<template>
<!--查看单个订单弹框中的详细信息组件  -->
  <div class="list-box">
    <a-row class="rows" type="flex" justify="start" align="middle">
      <a-col :span="6" v-for="item in infoDatas" :key="item.id">
        <div class="cells">
          <a-col class="cellchild title" :span="9">{{item.title}}<span class="space5px">:</span> </a-col>
          <a-col class="cellchild value" :span="15">
            <img v-if="item.type=='img'" :src="item.value" style="height:120px;width:180px" alt="logo">
            <span v-else>{{item.value}}</span>
          </a-col>
        </div>
      </a-col>
    </a-row>
    <div class="clearfloat"></div>
  </div>
</template>

<script>
export default {
    props:{
        infoDatas:{
            type:Array
        }
    },
    data(){
        return {
           
        }
    }
}
</script>

<style scoped>
.list-box{
   
}
.clearfloat{clear:both;height:0;}
.list-box .cells{
    /* border: 1px solid sienna; */
    margin: 5px 0;
    display: flex;
    align-items: center; 
    justify-content: center; 
}
.list-box .rows{
    width: 100%;
    border: 1px solid teal;
    margin-bottom: 10px;
}
.list-box .title{
    /* background-color:skyblue; */
    text-align:right;
    color: teal;
    
}
.list-box .value{
    /* background-color:springgreen; */
    text-align: left;
}
.cells .space5px{
    margin: auto 5px;
}
</style>